<template>
  <ui/>
</template>
<script setup lang="ts">
import ui from './components/UI.vue'
import {onMounted,watch,ref,getCurrentInstance } from 'vue'
import autofit  from "autofit.js";
let { ctx: that } = getCurrentInstance()
const screenWidth = ref(window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth)
onMounted(() => {
  autofit.init({
        dh: 1080,
        dw: 1920,
        el: "#app",
        resize: true
      },
      false
  )
  window.onresize = () => {
    return (() => {
      screenWidth.value = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth
    })()
  }
})

watch(() => screenWidth.value, (newVal,oldValue) => {
  that.$forceUpdate();
  window.onresize = () => {
    return (() => {
      screenWidth.value = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth
    })()
  }
})

</script>

<style scoped></style>
